<template>
  <div class="content-box">
    <el-descriptions :column="3" size="large">
      <el-descriptions-item label-class-name="right-align" label="检查方法："
        ><span class="text--info subtext">{{
          baseInfo?.insMethod
        }}</span></el-descriptions-item
      >
      <el-descriptions-item label-class-name="right-align" label="检查小结："
        ><span class="text--info subtext">{{
          baseInfo?.insSummary
        }}</span></el-descriptions-item
      >
      <el-descriptions-item label-class-name="right-align" label="提交人：">
        <span class="text--info subtext">{{
          baseInfo?.createUserName
        }}</span></el-descriptions-item
      >
      <el-descriptions-item label-class-name="right-align" label="提交时间：">
        <span class="text--info subtext">{{
          baseInfo?.createTime
        }}</span></el-descriptions-item
      >
    </el-descriptions>
  </div>
</template>

<script lang="ts" setup>
import { defineProps, watch, ref } from "vue";
const props = defineProps({
  basicInfoData: {
    type: Object,
    default: () => {}
  }
});

let baseInfo = ref(null);

watch(
  () => props.basicInfoData,
  newVal => {
    if (newVal) {
      baseInfo.value = newVal;
    }
  },
  {
    deep: true,
    immediate: true
  }
);
</script>

<style lang="scss" scoped>
// .divider {
//   margin-bottom: 10px;
//   // border-left: 3px solid #409eff;
//   text-indent: 8px;
// }
// .content {
//   width: 100%;
//   margin-bottom: 20px;
// }

// :deep .el-select {
//   width: 100%;
// }
// :deep .el-date-editor {
//   width: 100%;
// }
</style>
